var gulp = require('gulp'),
    connect = require('gulp-connect');//使用connect启动一个Web服务器
var sass = require('gulp-sass');
var rename = require('gulp-rename');
var browserSync = require('browser-sync').create();



// gulp.task('connect', function() {
//     connect.server({
//         // host: '192.168.1.172', //地址，可不写，不写的话，默认localhost
//         port: 3000, //端口号，可不写，默认8000
//         root: 'www', //当前项目主目录
//         livereload: true //自动刷新
//     });
// });

gulp.task('html', function() {
    gulp.src('www/**/*.html')
        .pipe(connect.reload());
});

gulp.task('buildScss', () => {
    gulp.src('www/scss/*.scss')
        .pipe(sass())
        .on('error', sass.logError)
        .pipe(rename({extname: '.css'}))
        .pipe(gulp.dest('www/css/'));
});

gulp.task('watch', function() {
    gulp.watch('www/scss/*.scss', ['buildScss']);
    // gulp.watch('./css/*.css', ['html']); //监控css文件
    // gulp.watch('./js/*.js', ['html']); //监控js文件
    gulp.watch(['www/*.html'], ['html']); //监控html文件
}); //执行gulp server开启服务器


// gulp.task('default', [ 'html', 'buildScss', 'connect', 'watch']);

// *** gulp-connect 无法自动刷新页面,所以用browerSync ***

gulp.task('default', function() {
    browserSync.init({  
        server: "www",  
    });  
  
    gulp.watch("./www/**/*.html").on('change', browserSync.reload);  
    gulp.watch('www/scss/*.scss', ['buildScss']).on('change', browserSync.reload); 
})
